<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" isELIgnored="false"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<% 

String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!doctype html>
<html>
  <head>
    <base href="<%=basePath%>">
    <title>流程设计器</title>
    
    <link type="text/css" rel="stylesheet" href="<%=path%>/resources/script/jquery/easyui/themes/default/easyui.css" />
    <link type="text/css" rel="stylesheet" href="<%=path%>/resources/script/jquery/easyui/themes/icon.css" />
    <link type="text/css" rel="stylesheet" href="<%=path%>/resources/script/workflow/workflow/designer/css/designer.css" />
 	
	<script type="text/javascript" src="<%=path%>/resources/script/jquery/jquery-1.11.3.js"></script>
	<script type="text/javascript" src="<%=path%>/resources/script/jquery/easyui/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="<%=path%>/resources/script/jquery/easyui/locale/easyui-lang-zh_CN.js"></script>
	<script type="text/javascript" src="<%=path%>/resources/script/raphael/raphael-min.js"></script>
	<script type="text/javascript" src="<%=path%>/resources/script/workflow/workflow/designer/js/raphael-utils.js"></script>
	<script type="text/javascript" src="<%=path%>/resources/script/workflow/workflow/designer/js/xmltochart.js"></script>
	<script type="text/javascript" src="<%=path%>/resources/script/workflow/workflow/designer/js/property.js"></script>
	<script type="text/javascript" src="<%=path%>/resources/script/workflow/workflow/designer/designer.js"></script>

  </head>
 <style>

.wf_line_oper{
	width:120px;height:15px;
	background-color:#D8E8FC;border:#7DA2CE 1px solid;position:absolute;
	z-index:10000;
}
.wf_line_oper b{display:inline-block;width:15px;height:15px;cursor:pointer;}
.b_l1{background: url("resources/js/workflow/designer/images/line_oper.png") no-repeat 1px -29px; }
.b_l2{background: url("resources/js/workflow/designer/images/line_oper.png") no-repeat 1px -44px;}
.b_x2{
background: url("resources/js/workflow/designer/images/line_oper.png") no-repeat 1px -0px;}
.b_x1{background: url("resources/js/workflow/designer/images/line_oper.png") no-repeat 1px -14px;}
.b_l3{background: url("resources/js/workflow/designer/images/line_oper.png") no-repeat 1px -60px;}
.b_x { width:16px; height:16px;background: url("resources/js/workflow/designer/images/line_oper.png") no-repeat 1px -75px; }

.wf_node_oper{
	width:16px; height:15px;
	background-color:#D8E8FC;border:#7DA2CE 1px solid;position:absolute;
	z-index:9999;	
} 

.attr-tr{
	clear:both;
}
.attr-lable{
	width: 100px; float: left; text-align: right; height:30px; line-height: 30px;
}
.attr-text{
	width: 200px; float: left; padding:3px;
}
.node-attr{
	width:500px !important; line-height: 24px;
}
 </style> 
<body class="easyui-layout" style="width:100%;height:100%;">
<form action="">
<input type="hidden" id="workFlowId" name="workFlowId" value="${workFlowId}">
<input type="hidden" id="wftypeId" name="wftypeId" value="${wftypeId}">
<input type="hidden" id="formTypeId" name="formTypeId" value="${formTypeId}"/>
<div data-options="region:'west',split:true" style="width: 157px;">
	<div id="tabs" class="easyui-tabs" data-options="fit:true,border:false">
    	<div title="工具栏"> <!--  data-options="iconCls:'icon-tool'" -->
    		<div id="tools">
				<div title="select" class="btn btn_down"><span class="icon_select">选择</span></div>
				<div title="transition" class="btn btn_up_split"><span class="icon_transtion">转换</span></div>
				<div title="start" class="btn btn_up"><span class="icon_start">开始</span></div>
				<div title="end" class="btn btn_up_split"><span class="icon_stop">结束</span></div>
				<div title="task" class="btn btn_up"><span class="icon_task">任务</span></div>
				<div title="fork" class="btn btn_up"><span class="icon_fork">分支</span></div>
				<div title="join" class="btn btn_up"><span class="icon_join">合并</span></div>
				
			    <div title="sign" class="btn btn_up"><span class="icon_sign">会签</span></div>
			    <div title="subPro" class="btn btn_up"><span class="icon_sub_process">子流程</span></div>
				
				<div title="decision" class="btn btn_up"><span class="icon_bool">决策</span></div>
				<!--<div title="mail" class="btn btn_up_split"><span class="icon_mail">邮件</span></div>-->
			</div>
     	</div>
     	<div title="节点信息" data-options=""> 
     	555
     	</div>
	</div>
</div>
<div data-options="region:'center'" class="easyui-layout">
	<div data-options="region:'north', border:false, split:false" 
		style="border-bottom: 1px solid #95B8F7;background-color: #DFE8F7;height: 31px; line-height:30px; text-align: right;">
		<a href="javascript:;" class="easyui-linkbutton" data-options="plain:true">导出流程</a>
		<a href="javascript:;" id="gridBtn" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-grid'">栅格</a>
		<a href="javascript:;" id="showXml" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-xml'">查看XML</a>
		<a href="javascript:;" id="saveFlow" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-saveflow'">保存流程</a>
		<a href="javascript:;" id="deployFlow" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-deploy'">发布流程</a>
	</div>
	<div data-options="region:'center', border:false, split:false">
		<div id="center"></div>
	</div>
</div>
<div data-options="region:'south',border:false" style="height:180px; background-color:#DFE8F7;">
	<div style="margin: 5px; padding:8px; height:125px; border:1px solid #A4B1C2; border-radius:5px;"> 
		<div class="attr-tr">
			<div class="attr-lable">名&nbsp;&nbsp;称：</div>
			<div class="attr-text"><input type="text" id="baseName" name="baseName" onkeyup="baseNameKeyup(this)" class="pro-txt"></div>
			<div id="nodeAttrDiv">
			<div class="attr-lable">节点属性：</div>
			<div class="attr-text node-attr">
				<input type="checkbox" id="dynamicSelect" name="dynamicSelect" style="vertical-align: middle;">动态分配 
				<input type="checkbox" id="dynamicJump" name="dynamicJump" style="vertical-align: middle;">动态跳转
				<input type="checkbox" id="trunTodo" name="trunTodo" style="vertical-align: middle;">转办   
				<input type="checkbox" id="isRevoke" name="isRevoke" style="vertical-align: middle;">回收   
				<input type="checkbox" id="isReject" name="isReject" style="vertical-align: middle;">驳回	
				<input type="checkbox" id="turnToPromoter" name="turnToPromoter" style="vertical-align: middle;">任务发起人
				<input type="checkbox" id="fileUp" name="fileUp" style="vertical-align: middle;">附件文书   
			</div>
			</div>
		</div>
		<div id="opDiv" class="attr-tr">
			<div class="attr-lable">操作选项：</div>
			<div class="attr-text"><select id="operates" name="operates" class="pro-txt"></select></div>
			<div class="attr-lable">任务委派：</div>
			<div class="attr-text node-attr">
				<input type="hidden" id="actorType" name="actorType">
               	<input type="text" id="actorIds" name="actorIds" class="pro-txt">
			</div>
		</div>
		<div class="attr-tr">
			<div class="attr-lable">流程表单：</div>
			<div class="attr-text">
				<select id="formTypeId" name="formTypeId" class="easyui-combobox pro-txt" 
                 	data-options="valueField:'formTypeId', textField:'formName',url:'forms/forms',onSelect: function(res){ formsChange(res);  }"></select>
			</div>
			<div class="attr-lable">节点位置：</div>
			<div class="attr-text node-attr">
				X <input type="text" id="nodeX" name="nodeX" class="pro-txt" style="width: 30px;">
				Y <input type="text" id="nodeY" name="nodeY" class="pro-txt" style="width: 30px;">
			</div>
			<!-- 
			<div class="attr-lable">审核时限：</div>
			<div class="attr-text node-attr"><input type="text" id="" name=""  class="pro-txt"></div>
			 -->
		</div>
		<div id="signDiv" class="attr-tr">
			<div class="attr-lable">策略类型：</div>
			<div class="attr-text">
                 <select id="sign" name="sign" class="easyui-combobox pro-txt" onblur="signBlur(this)">
		             <option value="1">一票否决制</option>
		             <option value="2">一票通过制</option>
		             <option value="3">意见收集制</option>
		             <option value="4">比例通过制</option>
                    </select>
			</div>
			<div id="signValueDiv" style="display:none;">
			<div class="attr-lable">策 略 值：</div>
			<div class="attr-text node-attr"><input type="text" id="signValue" name="signValue" onkeyup="signValueKeyup(this)" class="pro-txt"></div>
			</div>
		</div>		
	</div>
</div>

<!-- 节点操作 -->
<div id="node_operate" class="wf_node_oper" style="display:none; left: 200px; top: 188px;">
    <div id="delNode" class="b_x"></div>
</div>
<!-- 线操作 -->
<div id="line_operate" class="wf_line_oper" style="display:none; left: 200px; top: 188px;">
	<b id="leftRight" class="b_l1"></b>
	<b id="topDown" class="b_l2"></b>
	<b id="borkenLine" class="b_x1"></b>
	<b id="borkenLine1" class="b_x2"></b>
    <b id="normalLine" class="b_l3"></b>
    <b id="delLine" class="b_x"></b>
</div>
</form>
<!-- 查看XML窗口 -->
<div id="showXmlWin" class="easyui-window" title="查看XML" style="width:950px;height:450px;" data-options="modal:true,collapsible:false,minimizable:false,maximizable:false,iconCls:'icon-xml'">   
	<div class="easyui-layout" data-options="fit:true">
		<div data-options="region:'center', border:0">
			<table class="add_infor" width="100%" border="0" cellpadding="0" cellspacing="0">
				<tr><td><textarea id="xmlTextArea" name="descript" class="t_textarea"></textarea></td></tr>
			</table>
		</div>
		<div data-options="region:'south'" style="text-align: center;height: 50px; line-height: 45px;">
			<a href="javascript:;" id="saveXml" class="easyui-linkbutton" data-options="iconCls:'icon-save'">保存</a>
			<a href="javascript:$('#showXmlWin').window('close');" class="easyui-linkbutton" data-options="iconCls:'icon-cancel'">取消</a>
		</div>
	</div>
</div> 
<!-- 人员选择器窗口 -->
<div id="selectorWin" class="easyui-window" data-options="title:'任务委派',modal:true,collapsible:false,minimizable:false,maximizable:false,iconCls:'icon-xml'" style="width:700px; height:450px;">
	<iframe id="selectorFrame" src="" width=100% height=100% marginwidth=0 framespacing=0 marginheight=0 frameborder=no scrolling=no></iframe>
</div>
</body>
</html>
